{% extends "/shared/layout.html" %}
{% block mainContent %}
<div class="header">
     <div class="wrapper">
       <ul>
         <li>
           {% include '/game/game_summary_partial.html' %}
         </li>
         <li>
          <div class="g_list">
            <dl class="g_select">
              {% for i in range(4) %}
                {% with map_obj = map_list[i] %}
                  {% if map_obj %}
                  <dd class="dd_{{i+1}}" style="background-image: url('../static/images/{{map_obj.map_mini_picture}}')">
                    <a href="/game/choose_map?map_id={{map_obj.map_id}}">
                      <div class="g_desc"><h1>{{map_obj.map_name}}</h1><p>{{map_obj.map_content}} ---{{map_obj.map_length}}{{layoutRes.unitKM}}</p></div>
                    </a>
                  </dd>
                  {% else %}
                  <dd class="dd_{{i+1}}">
                    <div class="g_desc">{{pageRes.mapDefaultDesc|safe}}</div>
                  </dd>
                  {% endif %}
                {% endwith %}
              {% endfor %}
            </dl> 
          </div>      
         </li>
       </ul>
     </div>
  </div>
  <div class="wrapper">
    <div class="g_list">
      <dl class="g_select">
       {% for i in range(4,8) %}
          {% with map_obj = map_list[i] %}
          {% if map_obj %}
          <dd class="dd_{{i+1}}" style="background-image: url('../static/images/{{map_obj.map_mini_picture}}')">
            <a href="/game/choose_map?map_id={{map_obj.map_id}}">
              <div class="g_desc"><h1>{{map_obj.map_name}}</h1><p>{{map_obj.map_content}} ---{{map_obj.map_length}}{{layoutRes.unitKM}}</p></div>
            </a>
          </dd>
          {% else %}
          <dd class="dd_{{i+1}}">
            <div class="g_desc">{{pageRes.mapDefaultDesc|safe}}</div>
          </dd>
          {% endif %}
        {% endwith %}
        {% endfor %}
      </dl>
    </div>
    <a href="###">
      <img src="../static/images/maps/world_map.jpg"/>  
    </a>
 </div>

<script type="text/javascript" src="../static/scripts/views/game/etlinking.views.online.js"></script>
<script type="text/javascript">
  $(function() {
    nsbase.views.online.init();
  });
</script>
{% endblock %}